.permissionBox {
  --p: 8px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  background: $white;
  .permissionBox-btn {
    padding: var(--p);
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .permissionBox-main {
    flex: 1;
    overflow: hidden;
  }
  .permissionBox-head {
    background: $hover;
    line-height: 32px;
    font-weight: bold;
  }
  .el-link {
    margin-top: 6px;
  }
  .tr {
    display: flex;
    .td {
      padding: 2px var(--p);
      &:nth-child(1) {
        width: 200px;
      }
      &:nth-child(3) {
        width: 100px;
        text-align: center;
      }
      &:nth-child(2) {
        flex: 1;
        overflow: hidden;
      }
      ul.button {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        margin-right: -16px;
        li {
          margin-right: 16px;
          display: flex;
          align-items: center;
          .el-icon {
            margin-left: 8px;
            filter: alpha(opacity=0);
            opacity: 0;
            &:hover {
              color: $primary;
            }
          }
          &:hover {
            .el-icon {
              filter: alpha(opacity=1);
              opacity: 1;
            }
          }
        }
      }
    }
  }
  .permissionBox-main {
    .tr {
      &:hover {
        background: $hover;
      }
    }
  }
}
